import { Component,ViewChild } from '@angular/core';
import { NgModel } from '@angular/forms';
import {PrepService} from "../../myService/test.component";

@Component({
  selector: 'all_select',
  template: `
    <div style="border-bottom: 1px solid rgb(233, 233, 233);">
      <label nz-checkbox [(ngModel)]="allChecked" (ngModelChange)="updateAllChecked()" [nzIndeterminate]="indeterminate">
        全选
      </label>
    </div>
    <br>
    <nz-checkbox-group [(ngModel)]="checkOptionsOne" (ngModelChange)="updateSingleChecked()"></nz-checkbox-group>
  `
})
export class AllComponent {
  //定义要传递的参数（此处是一个对象，也可以是方法）
  reponsePrep:any=[
    { "title":"来自全选页面" , "name":"接收" },
    { "title":"传值" , "name":"接收" },
    { "title":"参数" , "name":"接收" }
    ]
  //构造器注入PrepService服务
  constructor(private ps:PrepService){
    //把当前组件参数赋值给PrepService的profileInfo属性
    ps.profileInfo=this.reponsePrep;
  }
  allChecked = false;
  indeterminate = true;
  checkOptionsOne = [
    { label: 'Apple', value: 'Apple', checked: true },
    { label: 'Pear', value: 'Pear', checked: false },
    { label: 'Orange', value: 'Orange', checked: false }
  ];

  updateAllChecked(): void {
    this.indeterminate = false;
    if (this.allChecked) {
      this.checkOptionsOne.forEach(item => item.checked = true);
    } else {
      this.checkOptionsOne.forEach(item => item.checked = false);
    }
  }

  updateSingleChecked(): void {
    if (this.checkOptionsOne.every(item => item.checked === false)) {
      this.allChecked = false;
      this.indeterminate = false;
    } else if (this.checkOptionsOne.every(item => item.checked === true)) {
      this.allChecked = true;
      this.indeterminate = false;
    } else {
      this.indeterminate = true;
    }
  }
}
